import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import http from "./utils/http";
import Foot from "./components/Foot.vue";

import { REQ_PREFIX, FILE_SUFFIX_TO_MIME } from "./common/common-constant";

// 将移动端适配添加main.js中
import "lib-flexible/flexible";
// 引入事件监听
import mitt from 'mitt';
const emitter = new mitt(); //实例化mitt
// 日期格式化
import moment from 'moment';
// 导入自定义图标阿里fontclass
import './assets/iconfont/iconfont.css';
import './assets/iconfont/iconfont.js';

// vue 视频播放插件
import VideoPlayer from 'vue-video-player/src';
import 'vue-video-player/src/custom-theme.css';
import 'video.js/dist/video-js.css';
// 支持m3u8格式
import 'videojs-contrib-hls';
// 音频播放
import vueAplayer from 'vue3-aplayer'
// 点击外部元素事件
import VueClickAway from "vue3-click-away";

// 1，全部导入
// import vant from "vant";
// import "vant/lib/index.css";
// 2，按需导入
import {
  Overlay,
  Progress,
  ImagePreview,
  Lazyload,
  ConfigProvider,
  NavBar,
  Tabbar,
  TabbarItem,
  IndexBar,
  IndexAnchor,
  SwipeCell,
  Cell,
  Button,
  Card,
  Badge,
  Divider,
  Icon,
  Image as VanImage,
  Tag,
  Tabs,
  Tab,
  Field,
  CellGroup,
  Sticky,
  Popup,
  Grid,
  GridItem,
  ShareSheet,
  Popover,
  Search,
  Empty,
  Toast,
  Collapse,
  CollapseItem,
  List,
  PullRefresh,
  Col,
  Row,
  Form,
  Dialog,
} from "vant";



// 配置全局socket
let socket = {
  // socket配置
  config: {
    url: 'wss://m.ouyunc.com:8001',
    //url: 'ws://106.15.42.106:8001',
    //url: 'wss://106.15.42.106:8008',
    //url: 'wss://ouyunc.com:8008',
    //url: 'wss://192.168.10.152:8001',
    // 客户端唯一标识，可以是手机号，身份证号，邮箱等,这里使用手机号
    identity: "",
    // 服务端分配的key
    appKey: "ouyunc",
    // 服务端分配的秘钥
    appSecret: "ouyunc",
    onopen: function (e) {
      console.log("socket 连接建立成功");
    },
    // 接收消息
    onmessage: function (message, messageType, messageId) {

      // 当有消息来，发布出去
      emitter.emit('onmessage', { 'message': message, 'messageType': messageType, 'messageId': messageId });





      // 在这里将接收到的消息进行底部提示（在服务端实际标识已经收到该消息）
      // 每次来消息都从缓存中取出然后判断赋值，在发布出去动态更新数据
      var { pendingMessageCount, pendingContactCount, pendingMeetingCount } = store.state.imPendingOverview;
      switch (messageType) {
        case SOCKET_CONSTANT.PACKET.MESSAGE_TYPE.IM_FRIEND_ADD_REQ:
          // 重新存储在vuex中,其他子页面只需要从缓存中读取就可以了
          store.commit(
            "setImPendingOverview",
            {
              pendingMessageCount: pendingMessageCount,
              pendingContactCount: pendingContactCount + 1,
              pendingMeetingCount: pendingMeetingCount,
            },
          );
          break;
        default:

          break;
      }
      // 这里只是用总线发布订阅，推送底部栏的信息
      emitter.emit('tabbar-state-event');

    },
    // 连接关闭
    onclose: function (e) {
      // 直接提示连接关闭
    },
    // 连接异常
    onerror: function (e) {
      // 直接提示连接异常
    },
  }

};

var app = createApp(App);
//监听器
app.config.globalProperties.$emitter = emitter;
// 将http全局注册
app.config.globalProperties.$http = http; //全局配置http
// 将socketConfig 挂载到实例上
app.config.globalProperties.$socket = socket; //全局配置socket
// 请求前缀，挂载实例
app.config.globalProperties.$reqPrefix = REQ_PREFIX; //请求前缀
app.config.globalProperties.$fileSuffix = FILE_SUFFIX_TO_MIME; //文件后缀

// 全局过滤器属性
app.config.globalProperties.$filters = {
  // 日期格式化
  dataformat (input, fmtstring) {//当input为时间戳时，需转为Number类型
    if (input <= 0) {
      return ''
    }
    return moment(input).format(fmtstring);
  },
  // 超过最大长度后面以省略号来显示
  ellipsis (value, maxLength) {
    if (!value) return '';
    if (value.length > maxLength) {
      return value.slice(0, maxLength) + '...'
    }
    return value
  },
  // 将文件大小转成KB，MB,GB
  convertFileSize (value) {//需转为Number类型
    if (value > 1024 * 1024 * 1024) {
      return (value / 1024 * 1024 * 1024).toFixed(2) + 'GB';
    } else if (value > 1024 * 1024) {
      return (value / 1024 * 1024).toFixed(2) + 'MB';
    } else {
      return (value / 1024).toFixed(2) + 'KB';
    }
  },
};


// 全局注册组件
app.component("foot", Foot);
// 音频播放注册全局组件
app.component("Aplayer", vueAplayer);

app
  .use(Overlay)
  .use(Progress)
  .use(VueClickAway)
  .use(VideoPlayer)
  .use(ImagePreview)
  .use(Lazyload)
  .use(moment)
  .use(Dialog)
  .use(Form)
  .use(Col)
  .use(Row)
  .use(PullRefresh)
  .use(List)
  .use(Collapse)
  .use(CollapseItem)
  .use(Toast)
  .use(Empty)
  .use(Search)
  .use(Popover)
  .use(Grid)
  .use(ShareSheet)
  .use(GridItem)
  .use(CellGroup)
  .use(Field)
  .use(Sticky)
  .use(Popup)
  .use(ConfigProvider)
  .use(VanImage)
  .use(NavBar)
  .use(Tabbar)
  .use(Tabs)
  .use(Tab)
  .use(TabbarItem)
  .use(IndexBar)
  .use(IndexAnchor)
  .use(SwipeCell)
  .use(Cell)
  .use(Tag)
  .use(Button)
  .use(Card)
  .use(Badge)
  .use(Divider)
  .use(Icon)
  .use(store)
  .use(router)
  .mount("#app");
